<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        img{
            float:right
        }
    </style>
</head>
<body>
    <div class="box">
        <img width="200" height="200"src="https://ts1.tc.mm.bing.net/th/id/OIP-C.XS6EtBzAmWWa31cfFvcx6QHaHa?rs=1&pid=ImgDetMain&o=7&rm=3">
    </div>
    <p>
        内部元素的布局影响
input 和 button 是行内块（inline-block）或行内元素（具体取决于浏览器默认样式），但它们被包裹在 div 中时，不会改变 div 的块级行为。
如果这些内部元素没有设置浮动（float）、弹性布局（flex）或网格布局（grid），div 会继续以块级方式显示。
3. 可能的样式干扰
如果 div 或其父元素有额外的CSS（比如 display: block 或未重置的默认样式），也会强化块级表现。
浏览器默认样式表可能为 div 添加了外边距（margin）或内边距（padding），进一步突出其块级特性。
    </p>
</body>
</html>